/**
* BJ-DEMO
* Designed by vicco
* 2015.10.08
***/
html{overflow:hidden;}
@font-face{
    font-family: 'yh';
    src:local("Microsoft YaHei");
}
body{
    margin:0;padding:0;color: #40b5ed;
    font-family: "Microsoft YaHei", "微软雅黑" ;
    font-weight: lighter;
    overflow:hidden;
}
#wrap{
    width:100%;
    height:100%;
    background:url("../images/login-background.png") center no-repeat;
    background-color: #4787d8;
    background-size: cover;

   /* background: -webkit-gradient(linear, 0 0,0 70%, from(#48D1CC), to(#4682B4));
    background: -moz-linear-gradient(top,#48D1CC,#4682B4);
    background: -ms-linear-gradient(#48D1CC 0%,#4682B4 100%);*/
    
}
/*首先定义基本滚动条样式，此定义只适合基于webkit核心的浏览器*/
::-webkit-scrollbar {width: 10px;}/* Track & scroll thickness */
::-webkit-scrollbar-track {background-color:#f8f8f8;}/* Track color */
::-webkit-scrollbar-thumb {background-color: #eaeaea;}/* Scroll color */
::-webkit-scrollbar-thumb:hover {background-color:#cfcfcf;}
/*
 * 定义基础的录入框，文本框，选择等样式
 * -webkit-appearance:none; 取消了浏览器基本的样式设置，因此所有元素均通过以下样式重新定义
*/
input,button,select,textarea{outline:none;-webkit-appearance:none;font-family:'yh';font-size:.75em;} textarea{resize:none;height:100px;}
label{margin-right:10px;}
label:last-child{margin-right:0;}
form{margin:0;padding:0;}
::-webkit-input-placeholder{color:#cfcfcf;font-style:oblique;}
input:-webkit-autofill{-webkit-box-shadow: 0 0 0px 1000px white inset;}
/*配置基础文本录入框，文本域基础样式以及获得焦点后的特效*/
input[type=text],input[type=password],select,textarea{
    border:1px solid #fff;
   /* border-bottom:1px solid #cbcbcb;*/

    -webkit-border-radius: 3px;
    -webkit-transition:all .3s ease 0s;
}
/*input[type=text]:focus,input[type=password]:focus,textarea:focus,select:focus{*/
/*color:#24459a;*/
/*border-color:#00aced;*/
/*-webkit-box-shadow:0 0 3px #cbcbcb inset;*/
/*}*/
/*单独设置文本框和选择框的高度*/
input[type=text],input[type=password],select{
    padding-left:14px;
    color:#000;
    -webikit-box-sizing:border-box;
}

#loading{
    position:absolute;
    top:50%;
    height:50px;
    text-align:center;
}

.small-logo{
    position:absolute;
    right: 0px;
    top:25%;
    z-index:100;
    width:500px;
  color: white;

}

#content{
    width:500px;
    height:300px;
   /* margin:-205px 0 0 -165px;*/
    position:absolute;
    right: 0px;
    top:35%;
    display:none;
    opacity:.5;
    z-index:100;
    background:#4087D0;
   /* border-radius:40px;*/
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    z-index:10;
    box-shadow: rgba(64, 135, 208, 0.47);
}

#testBrowserContent{
    width:330px;
    height:340px;

    position:absolute;
    left:50%;top:30%;
    display:none;
    z-index:100;
    background:#fff;
    border-radius:40px;
    z-index:11;
    box-shadow:0 0 35px #2e7393;
}

#testBrowser-name{
    font-size:18px;
    position:absolute;
    left:50%;top:23%;
    right: 10%;
    letter-spacing:0px;
    margin-left:-130px;
}

.download_chrome{
		/* margin:40px auto;
		padding:15px 20px;
		text-align: center; */
		width:100px;
		color:#fff;font-size:16px;
		background:#8dbc48;
	}
.shak-ani{
    -webkit-animation:shake 1s 0s ease both;
}
@-webkit-keyframes shake{
    0%,100%{-webkit-transform:translateX(0);}
    10%,30%,50%,70%, 90%{-webkit-transform:translateX(-10px);}
    20%,40%,60%,80%{-webkit-transform:translateX(10px);}
}

#system-name{
    font-size:24px;
    position:absolute;
    left:50%;top:23%;
    letter-spacing:0px;
    margin-left:-130px;
}

#copyright{
    position:absolute;
    font-size:16px;
    left:35px;top:15%;
    /*color:#cbcbcb;*/
}

#name-input,#pwd-input{
    position:absolute;
    left:30%;

}
#name-input{
    top:22%;
}

#pwd-input{
    top:42%;
}
#name-input > input, #pwd-input > input{
    font-size:12px;
    height:30px;
    width:200px;
    background-color: #094080;
    color: white;
}
#pwd-caps{
    height:35px;width:160px;
    position:absolute;
    left:50%;top:50%;
    margin:55px 0 0 -150px;
    background:#eb4026;color:#fff;
    text-align:center;line-height:35px;
    font-size:12px;
    -webkit-border-radius:3px;
    -webkit-box-shadow:0 0 3px #333;
    display:none;
}
.pwdCapson{
    /*-webkit-animation:'slideUpCaps' .3s ease 0s 1;*/
}
/*@-webkit-keyframes 'slideUpCaps'{*/
    /*0%{opacity:0;margin-top:70px;}*/
    /*100%{opacity:1;margin-top:55px;}*/
/*}*/
#login-btn{
    position: absolute;
    left: 30%;
    top: 65%;
    width: 220px;
    height: 35px;
    -webkit-border-radius: 5px;
    background-color: #0661D4;
    color: #FFFFFF;
    font-weight:bold;
   /* text-indent:-9999em;*/
   /* background:url("../images/login.png") center no-repeat;*/
    border:1px solid #5d69f1;
    cursor:pointer;
    -webkit-transition:all .5s ease 0s;
}

#login-btn:hover{
    -webkit-box-shadow:0 0 10px #d4d4d4;
}
#login-btn:active{
    -webkit-box-shadow:0 0 8px #d4d4d4 inset;
}
#error{
    width:490px;
    height:50px;
    position:absolute;
    top:50%;left:50%;
    margin-top:-300px;
    margin-left:-240px;
    background:#eb4026;
    border-radius:5px;
    z-index:9;
    text-align:center;
    line-height:50px;
    color:#fff;font-size:18px;
    display:none;
    -webkit-box-shadow:0 0 10px #ad301c;
}
/*.showUp{*/
    /*-webkit-animation:'upShow' .5s ease 0s 1;*/
/*}*/
/*.showDown{*/
    /*-webkit-animation:'downShow' .5s ease 0s 1;*/
/*}*/

.ball{
    position:absolute;
    background:#c7e6e8;
    z-index:1;
    -webkit-border-radius:500px;
    -webkit-transition:all 2s ease 0s;
}

#company-copyright{
    position:absolute;
    left:-webkit-calc( 50% - 90px );
    bottom:-40px;text-align:center;
    line-height:24px;
    color: #c4daf5;
}

